{% load static %}

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Title</title>
	<link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1-dist/css/bootstrap.css' %}">
	<style>
		.account {
			width: 400px;
			border: 1px solid #dddddd;
			border-radius: 5px;
			box-shadow: 5px 5px 20px #aaa;

			margin-left: auto;
			margin-right: auto;
			margin-top: 100px;
			padding: 20px 40px;
		}

		.account h2 {
			margin-top: 10px;
			text-align: center;
		}
	</style>
</head>
<body>
<div class="account">
	<h2>用户登录</h2>
	<form method="post" novalidate>
		{% csrf_token %}
		<div class="form-group">
			<label>用户名 <span style="color:red;font-size:10px">{{ form.username.errors.0 }}</span></label>
			{{ form.username }}

			{#			<input type="text" class="form-control" placeholder="用户名">#}
		</div>
		<div class="form-group">
			<label>密码 <span style="color:red;font-size:10px">{{ form.password.errors.0 }}</span></label>
			{{ form.password }}

			{#			<input type="password" class="form-control" placeholder="密码">#}
		</div>

		{# 验证码 #}
		<div class="form-group">
			<label for="id_code">图片验证码<span style="color:red;font-size:10px">{{ form.code.errors.0 }}</span></label>
			<div class="row">
				<div class="col-xs-7">{# 7栅格 #}
					{{ form.code }}

				</div>
				<div class="col-xs-5">{# 5栅格 #}
					<img id="image_code" src="/image/code/" style="width: 125px;">
				</div>
			</div>
		</div>

		<input type="submit" value="登录" class="btn btn-primary">
	</form>
</div>
</body>
</html>





















